<template>
  <div class="turntable-head">
    <div class="left">
      <div class="left-item"
           @click="$emit('showRecord')"
      > {{$t('lucky.doc8')}}</div>
    </div>
    <div class="right">
     <div class="right-item"
          @click="$emit('showRule')">
       {{$t('lucky.doc9')}}
     </div>
     <div class="right-item"
          @click="$router.push('/lucky/record')">
       {{$t('lucky.doc23')}}
     </div>
    </div>
  </div>
</template>

<script>
export default {
  props: ['signInfo'],
  data() {
    return {}
  }
}
</script>

<style lang="less" scoped>
.turntable-head {
  width: 100%;
  display: flex;
  justify-content: space-between;
  line-height: 1.2;
  margin-top: .2rem;
  .left {
    .left-item {
      padding: .18rem .24rem;
      border: .02rem solid #0570FD;
      color: #5CA2FF;
      font-family: "PingFang TC";
      font-size: .24rem;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      border-radius: 0 .24rem .24rem 0;
      border-left: none;
    }
  }

  .right {
    .right-item{
      padding: .18rem .24rem;
      border: .02rem solid #0570FD;
      color: #5CA2FF;
      font-family: "PingFang TC";
      font-size: .24rem;
      font-style: normal;
      font-weight: 600;
      line-height: normal;
      border-radius: .24rem 0 0 .24rem;
      border-right: none;
      &:last-child{
        margin-top: .24rem;
      }
    }

  }
}
</style>